<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="../../js/lib/clipboard-v1.7.1/clipboard.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>
		<!-- Target -->
		<input id="foo" value="https://github.com/zenorocha/clipboard.js.git">
		<!-- Trigger -->
		<button class="btn" data-clipboard-target="#foo">Copy</button>
		<br />
		<textarea name="" rows="20" cols="30"></textarea>
		<hr />
		<textarea id="bar">Mussum ipsum cacilds...</textarea>

		<!-- Trigger -->
		<button class="btn" data-clipboard-action="cut" data-clipboard-target="#bar">Cut to clipboard</button>
		<hr />
		<!-- Trigger -->
		<button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">Copy to clipboard</button>
		<script type="text/javascript">
			var clipboard = new Clipboard('.btn');

			clipboard.on('success', function(e) {
				console.info('Action:', e.action);
				console.info('Text:', e.text);
				console.info('Trigger:', e.trigger);

				e.clearSelection();
			});

			clipboard.on('error', function(e) {
				console.error('Action:', e.action);
				console.error('Trigger:', e.trigger);
			});
		</script>
	</body>

</html>